﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>3.2.Attribute参数验证</title>
    <script type="text/javascript" src="../Content/highlighter/scripts/shCore.js"></script>
    <script type="text/javascript" src="../Content/highlighter/scripts/shBrushCSharp.js"></script>
    <script type="text/javascript" src="../Content/highlighter/scripts/shBrushXml.js"></script>
    <link type="text/css" rel="stylesheet" href="../Content/highlighter/styles/shCoreDefault.css"/>
    <script type="text/javascript">SyntaxHighlighter.all();</script>
</head>
<body>
	<style>
		table
		{
			border-top:1px solid black;
			border-left:1px solid black;
		}
		td
		{
			border-right:1px solid black;
			border-bottom:1px solid black;
		}
	</style>
    <h3>参数验证</h3>

    <p>
        html5前端验证
    </p>
	<pre class="brush: html;">
		<!--前端代码开始-->
		&lt;input name="name" type="text" required maxLength="12" minLength="3"/>
		<!--前端代码结束-->
    </pre>
	<p>
        HTML5服务端验证
    </p>
    <pre class="brush: csharp;">
		public void Index(
		//引入using NFinal.Advanced;
		//使用时,只需加html5的属性即可
		[type(type.text), required(), maxLength(12), minLength(3)]
		string name
		)
        {
			Write("姓名长度必须在3到12之间，且为必填字段");
		}
    </pre>
	<p>
		验证属性包括:type,maxLength,minLength,max,min,required,pattern等.
	</p>
	
	<p>
		<table cellspacing="0">
			<tr>
				<td>
					html5属性
				</td>
				<td>
					NFinal特性
				</td>
				<td>
					说明
				</td>
			</tr>
			<tr>
				<td>
					type="text"
				</td>
				<td>
					[type("text")]
				</td>
				<td>
					可以为任意字符
				</td>
			</tr>
			<tr>
				<td>
					type="email"
				</td>
				<td>
					[type("email")]
				</td>
				<td>
					必须为emial邮箱
				</td>
			</tr>
			<tr>
				<td>
					type="url"
				</td>
				<td>
					[type("url")]
				</td>
				<td>
					必须为URL路径
				</td>
			</tr>
			<tr>
				<td>
					type="number"
				</td>
				<td>
					[type("number")]
				</td>
				<td>
					必须为数字
				</td>
			</tr>
			<tr>
				<td>
					type="range",min="0",max="100",step=1
				</td>
				<td>
					[type("range"),min(0),max(100),step(1)]
				</td>
				<td>
					必须为数字，必须写上min,max,step属性
				</td>
			</tr>
			<tr>
				<td>
					type="date"
				</td>
				<td>
					[type("date")]
				</td>
				<td>
					必须为日期
				</td>
			</tr>
			<tr>
				<td>
					type="month"
				</td>
				<td>
					[type("month")]
				</td>
				<td>
					必须为月份
				</td>
			</tr>
			<tr>
				<td>
					type="week"
				</td>
				<td>
					[type("week")]
				</td>
				<td>
					必须为星期
				</td>
			</tr>
			<tr>
				<td>
					type="time"
				</td>
				<td>
					[type("time")]
				</td>
				<td>
					必须为时间
				</td>
			</tr>
			<tr>
				<td>
					type="datetime-local"
				</td>
				<td>
					[type("datetime-local")]
				</td>
				<td>
					必须为本地化时间
				</td>
			</tr>
			<tr>
				<td>
					type="search"
				</td>
				<td>
					[type("search")]
				</td>
				<td>
					可以为任意字符
				</td>
			</tr>
			<tr>
				<td>
					type="color"
				</td>
				<td>
					[type("color")]
				</td>
				<td>
					必须为颜色
				</td>
			</tr>
			<tr>
				<td>
					minLength="3"
				</td>
				<td>
					[minLength(3)]
				</td>
				<td>
					输入的最小长度为3
				</td>
			</tr>
			<tr>
				<td>
					maxLength="7"
				</td>
				<td>
					[maxLength("7")]
				</td>
				<td>
					输入的最大长度为7
				</td>
			</tr>
			<tr>
				<td>
					max="100"
				</td>
				<td>
					[max("100")]
				</td>
				<td>
					最大值为100，必须和type="range"一起使用
				</td>
			</tr>
			<tr>
				<td>
					min="1"
				</td>
				<td>
					[min("1")]
				</td>
				<td>
					最小值为1，必须和type="range"一起使用
				</td>
			</tr>
			<tr>
				<td>
					step="1"
				</td>
				<td>
					[step("1")]
				</td>
				<td>
					最小增值为1，必须和type="range"一起使用
				</td>
			</tr>
			<tr>
				<td>
					placeholder="请输入姓名"
				</td>
				<td>
					[placeholder("请输入姓名")]
				</td>
				<td>
					不作任何验证，起提示作用。
				</td>
			</tr>
			<tr>
				<td>
					required="required"
				</td>
				<td>
					[required()]
				</td>
				<td>
					不能为空值
				</td>
			</tr><tr>
				<td>
					pattern="\d+"
				</td>
				<td>
					[pattern("\d+")]
				</td>
				<td>
					必须符合正则表达式
				</td>
			</tr>
		</table>
	</p>
</body>
</html>
